<html>
<head>
<script src="../AngularJS/angular-1.5.0/angular.min.js"></script>
</head>
<body ng-app="docsTabsExample" ng-init="obj={'name':'name'}" ng-controller="ctrl">
  {{obj}}
  <div widget name="{{obj}}"></div>
  <div widget n="{{obj}}"></div>

<script>
var app=angular.module('docsTabsExample', []);
app.controller("ctrl",function($scope){
//$scope.obj={'name':'name'};
});
app.directive('widget', function() {
  return {
    restrict:"A",
    scope:{n:'@'}, 
//  scope:{}, 
    template:"{{obj.name}}<input type='text' ng-model='obj.name'/>",
    link:function(scope,element,attr){
    		console.log(111)
//  		scope.obj={'name':'name'};
    },
    controller:function($scope){ 
    	console.log(2222)
//  		$scope.obj={'name':'name'};
//      $scope.obj=JSON.parse($scope.name);
//				console.log($scope.n);
    }

  }  
});
</script>
</body>
</html>